<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2023/5/23
  Time: 23:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>退票管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layui/css/public.css" media="all">
    <style>
        .layui-table-cell{
            height:56px;
            line-height: 56px;
        }

    </style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-inline">
                                <input id="username" type="text" name="username" autocomplete="off" class="layui-input" placeholder="请输入用户名">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">始发地</label>
                            <div class="layui-input-inline">
                                <input id="startAdd" type="text" name="startAdd" autocomplete="off" class="layui-input" placeholder="请输入始发地" >
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">创建日期</label>
                            <div class="layui-input-inline">
<%--                                <input type="date" id="createTime" name="createTime"  placeholder="请选择日期" class="layui-input">--%>
                                <input type="text" id="createTime" name="createTime"  placeholder="请选择日期" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn "  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
        <script type="text/html" id="currentTableBar">
            <button id="btn" class="layui-btn layui-btn-radius" lay-submit lay-filter="returnMoney" >去退款</button>
        </script>
    </div>
</div>
<script src="/layui/layui.js" charset="utf-8"></script>
<script>
    layui.use('laydate', function(){
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#createTime' //指定元素
        });
    });
    layui.use(['form', 'table'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;
        table.render({
            elem: '#currentTableId',
            url: '/order?method=selectReturnTicket',
            toolbar: '#toolbarDemo',
            defaultToolbar: ['filter', 'exports', 'print'],
            skin: 'line',
            page:true,
            limits: [5, 10, 15, 20, 25, 50, 100],//每页条数的选择项
            limit: 10, //每页默认显示10条数据
            cols: [[
                {field: 'orderId',  title: 'ID'},
                {field: 'user.name',  title: '用户名', templet:function (res){return res.user.name}},
                {field: 'user.idNumber',  title: '身份证',templet:function (res){return res.user.idNumber}},
                {field: 'flight.flightNumber',  title: '航班号',templet:function (res){return res.flight.flightNumber}},
                {field: 'flight.startDate',  title: '出发日期',templet:function (res){return res.flight.startDate}},
                {field: 'flight.startTime',  title: '出发时间',templet:function (res){return res.flight.startTime}},
                {field: 'flight.startAdd',  title: '始发地',templet:function (res){return res.flight.startAdd}},
                {field: 'flight.targetAdd',  title: '目的地',templet:function (res){return res.flight.targetAdd}},
                {field: 'cabin',  title: '舱位'},
                {field: 'notes',  title: '备注'},
                {field: 'createTime',  title: '创建时间'},
                {field: 'updateTime',  title: '修改时间'},
                {title: '操作', width: 150, toolbar: '#currentTableBar', align: "center"}
            ]]
        });

        form.on('submit(returnMoney)', function (data){
            layer.confirm('确认退款吗', function (index) {
                console.log(data,index);
                layui.element.render('btn'); // 渲染按钮元素，确保按钮状态能够正确显示
                $('table tr:eq(' + index + ')').find("#btn").addClass("layui-btn-disabled").text("已退款").prop('disabled', true);

                // 将已退款行的信息存储到本地存储中
                var refundedRows = JSON.parse(localStorage.getItem('refundedRows')) || [];
                refundedRows.push({ index: index, buttonText: "已退款" });
                localStorage.setItem('refundedRows', JSON.stringify(refundedRows));
                layer.close(index);
            });
            return false;  // 阻止默认 form 跳转
        });
        /**
         * 监听搜索事件
         */
        form.on('submit(data-search-btn)', function () {
            var username = $('#username').val()
            var startAdd = $('#startAdd').val()
            var createTime = $('#createTime').val()
            //执行搜索重载
            table.reload('currentTableId',{
                url:'/order?method=selectReturnTicketByCondition&startAdd='+startAdd+'&username='+username+'&createTime='+createTime,
                page: {
                    curr: 1//重新从第 1 页开始
                }
                , where: {
                    startAdd:startAdd,
                    username:username,
                    createTime:createTime
                }
            });
            return false
        });
    });
 /*   layui.$(window).on('load', function() {
        // 从本地存储中获取已经退款的行信息并更新按钮状态
        updateButtonStatus();
    });
    // 从本地存储中获取已经退款的行信息并更新按钮状态
    function updateButtonStatus(index) {
        var refundedRows = JSON.parse(localStorage.getItem('refundedRows')) || [];
        refundedRows.forEach(function(refundedRow) {
            var index = refundedRow.index;
            layui.$('table tr:eq(' + index + ')').find("#btn").addClass("layui-btn-disabled").text("已退款").prop('disabled', true);
        });
    }*/
    // layui.$(window).on('load', function() {
    layui.$(window).load(function (){
        // 从本地存储中获取已经退款的行信息
        var refundedRows = JSON.parse(localStorage.getItem('refundedRows')) || [];
        console.log(refundedRows);
        // 遍历已经退款的行，将按钮设置为禁用状态并恢复文本内容
        refundedRows.forEach(function(refundedRow) {
            var index = refundedRow.index;
            console.log(index)
            // layui.element.render('btn'); // 渲染按钮元素，确保按钮状态能够正确显示
            layui.$('table tr:eq(' + index + ')').find("#btn").addClass("layui-btn-disabled").text("已退款").prop('disabled', true);
        });
    });
</script>
</body>
</html>
